<template>
  <!-- 服务能力 -->
  <div class="app">
    <div class="app-bg" id="AirCIMMapContainerView"></div>
    <TopTitle></TopTitle>
    <div style="display: flex; justify-content: space-between">
      <div class="left" style="margin-left: 30px;width: 460px;">
        <div style="position: relative;height: 921px;margin-top: 11px;">
          <AssessService></AssessService>
        </div>
      </div>
      <div class="middle" style="margin: 0 auto; width: 880px;">
        <div style="position: relative; margin-top: 20px; height: 78px">
          <AssessIconNum></AssessIconNum>
        </div>
      </div>
      <div
        class="right"
        style="margin-right: 30px; width: 460px;"
      >
        <div style="position: relative; margin-top: 11px;height: 537px">
          <AssessPower></AssessPower>
        </div>
        <div style="position: relative; margin-top: 20px;height: 364px">
          <AssessAnalyse></AssessAnalyse>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import TopTitle from "../components/elements/TopTitle.vue";
import AssessService from "../components/elements/AssessService.vue";
import AssessIconNum from "../components/elements/AssessIconNum.vue";
import AssessAnalyse from "../components/elements/AssessAnalyse.vue";
import AssessPower from "../components/elements/AssessPower.vue";
export default {
  components: {
    TopTitle,
    AssessService,
    AssessPower,
    AssessIconNum,
    AssessAnalyse,
  },
  methods: {
    initMap(){
      //加载场景 加载实例DOM,图层model,当前实例项
      AirCIMActiveScene('AirCIMMapContainerView','6',this);
    },
  },
  mounted() {
    this.initMap();
  }
};
</script>

<style>
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  width: 1920px;
  height: 1080px;
  background: rgba(2, 25, 35);
}
.app{
   position: relative;
 }
 .app-bg{
   width: 100%;
   height: 100%;
   position: absolute;
 }

</style>
